<template>
    <view v-if="stay==undefined">
        <view class="index">
            <view class="img" >
                <image  src="../../static/img2.png" style="width: 170px;height: 170px;" ></image>
            </view>
            <view class="msg">暂无数据</view>
        </view>
    </view>
    <view v-else-if="cancel==undefined" >
        <uni-notice-bar  style="text-align: center;" text="1个批次需要登记" single color="#FF5F00" background-color="#FFEEDD" />
        <view class="card1" @click="toapply()">
           <uni-row>
               <uni-col :span="3">
                   <image src="../../static/dengji.png" class="photo"></image>
               </uni-col>
               <uni-col :span="21">
                   <view class="zik"></view>
                   <text class="zi">2024年春节放假</text>
               </uni-col>
           </uni-row>
            <view style="margin-left:20px ">
                <text class="zi2">
                    假期开始时间：2023-11-16 00:00:00 \n
                    假期结束时间：2023-11-16 00:00:00 \n
                    时长：26天</text>
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <hr class="xian">
            </view>

            <view style="margin-left: 20px;margin-top: 8px">
                <uni-row>
                    <uni-col :span="22">
                        <view >
                            <text class="zi3">28人已完成，赶紧登记吧</text>
                        </view>
                    </uni-col>
                    <uni-col :span="2">
                        <view >
                            <image src="../../static/rightjt.png" style="width: 18px;height: 18px;background: #D5E4FF;"></image>
                        </view>
                    </uni-col>
                </uni-row>
            </view>


        </view>
        <view class="card1" style="margin-top: 20px" @click="toapply()">
            <uni-row>
                <uni-col :span="3">
                    <image src="../../static/dengji.png" class="photo"></image>
                </uni-col>
                <uni-col :span="21">
                    <view class="zik"></view>
                    <text class="zi">2024年春节放假</text>
                </uni-col>
            </uni-row>
            <view style="margin-left:20px ">
                <text class="zi2">
                    假期开始时间：2023-11-16 00:00:00 \n
                    假期结束时间：2023-11-16 00:00:00 \n
                    时长：26天</text>
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <hr class="xian">
            </view>

            <view style="margin-left: 20px;margin-top: 8px">
                <uni-row>
                    <uni-col :span="22">
                        <view >
                            <text class="zi3">28人已完成，赶紧登记吧</text>
                        </view>
                    </uni-col>
                    <uni-col :span="2">
                        <view >
                            <image src="../../static/rightjt.png" style="width: 18px;height: 18px;background: #D5E4FF;"></image>
                        </view>
                    </uni-col>
                </uni-row>
            </view>


        </view>
        <view class="card1" style="margin-top: 20px" @click="toapply()">
            <uni-row>
                <uni-col :span="3">
                    <image src="../../static/dengji.png" class="photo"></image>
                </uni-col>
                <uni-col :span="21">
                    <view class="zik"></view>
                    <text class="zi">2024年春节放假</text>
                </uni-col>
            </uni-row>
            <view style="margin-left:20px ">
                <text class="zi2">
                    假期开始时间：2023-11-16 00:00:00 \n
                    假期结束时间：2023-11-16 00:00:00 \n
                    时长：26天</text>
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <hr class="xian">
            </view>

            <view style="margin-left: 20px;margin-top: 8px">
                <uni-row>
                    <uni-col :span="22">
                        <view >
                            <text class="zi3">28人已完成，赶紧登记吧</text>
                        </view>
                    </uni-col>
                    <uni-col :span="2">
                        <view >
                            <image src="../../static/rightjt.png" style="width: 18px;height: 18px;background: #D5E4FF;"></image>
                        </view>
                    </uni-col>
                </uni-row>
            </view>
        </view>
        <view class="card1" style="margin-top: 20px" @click="toapply()">
            <uni-row>
                <uni-col :span="3">
                    <image src="../../static/dengji.png" class="photo"></image>
                </uni-col>
                <uni-col :span="21">
                    <view class="zik"></view>
                    <text class="zi">2024年春节放假</text>
                </uni-col>
            </uni-row>
            <view style="margin-left:20px ">
                <text class="zi2">
                    假期开始时间：2023-11-16 00:00:00 \n
                    假期结束时间：2023-11-16 00:00:00 \n
                    时长：26天</text>
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <hr class="xian">
            </view>

            <view style="margin-left: 20px;margin-top: 8px">
                <uni-row>
                    <uni-col :span="22">
                        <view >
                            <text class="zi3">28人已完成，赶紧登记吧</text>
                        </view>
                    </uni-col>
                    <uni-col :span="2">
                        <view >
                            <image src="../../static/rightjt.png" style="width: 18px;height: 18px;background: #D5E4FF;"></image>
                        </view>
                    </uni-col>
                </uni-row>
            </view>


        </view>
    </view>
    <view v-else-if="pass==undefined">
        <uni-notice-bar  style="text-align: center;" text="1个批次需要登记" single color="#FF5F00" background-color="#FFEEDD" />
        <view class="card1" @click="tocancle()">
            <uni-row>
                <uni-col :span="3">
                    <image src="../../static/dengji.png" class="photo"></image>
                </uni-col>
                <uni-col :span="21">
                    <view class="zik"></view>
                    <text class="zi">2024年春节放假</text>
                </uni-col>
            </uni-row>
            <view style="margin-left:20px ">
                <text class="zi2">
                    假期开始时间：2023-11-16 00:00:00 \n
                    假期结束时间：2023-11-16 00:00:00 \n
                    时长：26天</text>
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <hr class="xian">
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <uni-row>
                    <uni-col :span="2">
                        <view class="avatrial"><text class="avatrialname">张</text> </view>
                    </uni-col>
                    <uni-col :span="17">
                        <text class="trialmsg">审批中</text>
                    </uni-col>
                    <uni-col :span="5">
                        <view class="trialbu"> <text class="trialbumsg"> 撤销登记</text></view>
                    </uni-col>
                </uni-row>
            </view>
        </view>
        <view class="card1" style="margin-top: 20px" @click="tocancle()">
            <uni-row>
                <uni-col :span="3">
                    <image src="../../static/dengji.png" class="photo"></image>
                </uni-col>
                <uni-col :span="21">
                    <view class="zik"></view>
                    <text class="zi">2024年春节放假</text>
                </uni-col>
            </uni-row>
            <view style="margin-left:20px ">
                <text class="zi2">
                    假期开始时间：2023-11-16 00:00:00 \n
                    假期结束时间：2023-11-16 00:00:00 \n
                    时长：26天</text>
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <hr class="xian">
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <uni-row>
                    <uni-col :span="2">
                        <view class="avatrial"><text class="avatrialname">张</text> </view>
                    </uni-col>
                    <uni-col :span="17">
                        <text class="trialmsg">审批中</text>
                    </uni-col>
                    <uni-col :span="5">
                        <view class="trialbu"> <text class="trialbumsg"> 撤销登记</text></view>
                    </uni-col>
                </uni-row>
            </view>
        </view>
        <view class="card1" style="margin-top: 20px" @click="tocancle()">
            <uni-row>
                <uni-col :span="3">
                    <image src="../../static/dengji.png" class="photo"></image>
                </uni-col>
                <uni-col :span="21">
                    <view class="zik"></view>
                    <text class="zi">2024年春节放假</text>
                </uni-col>
            </uni-row>
            <view style="margin-left:20px ">
                <text class="zi2">
                    假期开始时间：2023-11-16 00:00:00 \n
                    假期结束时间：2023-11-16 00:00:00 \n
                    时长：26天</text>
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <hr class="xian">
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <uni-row>
                    <uni-col :span="2">
                        <view class="avatrial"><text class="avatrialname">张</text> </view>
                    </uni-col>
                    <uni-col :span="17">
                        <text class="trialmsg">审批中</text>
                    </uni-col>
                    <uni-col :span="5">
                        <view class="trialbu"> <text class="trialbumsg"> 撤销登记</text></view>
                    </uni-col>
                </uni-row>
            </view>
        </view>
        <view class="card1" style="margin-top: 20px" @click="tocancle()">
            <uni-row>
                <uni-col :span="3">
                    <image src="../../static/dengji.png" class="photo"></image>
                </uni-col>
                <uni-col :span="21">
                    <view class="zik"></view>
                    <text class="zi">2024年春节放假</text>
                </uni-col>
            </uni-row>
            <view style="margin-left:20px ">
                <text class="zi2">
                    假期开始时间：2023-11-16 00:00:00 \n
                    假期结束时间：2023-11-16 00:00:00 \n
                    时长：26天</text>
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <hr class="xian">
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <uni-row>
                    <uni-col :span="2">
                        <view class="avatrial"><text class="avatrialname">张</text> </view>
                    </uni-col>
                    <uni-col :span="17">
                        <text class="trialmsg">审批中</text>
                    </uni-col>
                    <uni-col :span="5">
                        <view class="trialbu"> <text class="trialbumsg"> 撤销登记</text></view>
                    </uni-col>
                </uni-row>
            </view>
        </view>
    </view>
    <view v-else-if="ok==undefined">
        <uni-notice-bar  style="text-align: center;" text="1个批次需要登记" single color="#FF5F00" background-color="#FFEEDD" />
        <view class="card1" @click="tonopass()">
            <uni-row>
                <uni-col :span="3">
                    <image src="../../static/dengji.png" class="photo"></image>
                </uni-col>
                <uni-col :span="21">
                    <view class="zik"></view>
                    <text class="zi">2024年春节放假</text>
                </uni-col>
            </uni-row>
            <view style="margin-left:20px ">
                <text class="zi2">
                    假期开始时间：2023-11-16 00:00:00 \n
                    假期结束时间：2023-11-16 00:00:00 \n
                    时长：26天</text>
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <hr class="xian">
            </view>

            <view style="margin-top: 10px;margin-left: 20px">
                <uni-row>
                    <uni-col :span="2">
                        <view class="avatrial"><text class="avatrialname">张</text> </view>
                    </uni-col>
                    <uni-col :span="17">
                        <text class="passmsg">审批不通过</text>
                    </uni-col>
                    <uni-col :span="5">
                        <view class="trialbu"> <text class="trialbumsg"> 修改登记</text></view>
                    </uni-col>
                </uni-row>
            </view>
        </view>
        <view class="card1" style="margin-top: 20px" @click="tonopass()">
            <uni-row>
                <uni-col :span="3">
                    <image src="../../static/dengji.png" class="photo"></image>
                </uni-col>
                <uni-col :span="21">
                    <view class="zik"></view>
                    <text class="zi">2024年春节放假</text>
                </uni-col>
            </uni-row>
            <view style="margin-left:20px ">
                <text class="zi2">
                    假期开始时间：2023-11-16 00:00:00 \n
                    假期结束时间：2023-11-16 00:00:00 \n
                    时长：26天</text>
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <hr class="xian">
            </view>

            <view style="margin-top: 10px;margin-left: 20px">
                <uni-row>
                    <uni-col :span="2">
                        <view class="avatrial"><text class="avatrialname">张</text> </view>
                    </uni-col>
                    <uni-col :span="17">
                        <text class="passmsg">审批不通过</text>
                    </uni-col>
                    <uni-col :span="5">
                        <view class="trialbu"> <text class="trialbumsg"> 修改登记</text></view>
                    </uni-col>
                </uni-row>
            </view>
        </view>
        <view class="card1" style="margin-top: 20px" @click="tonopass()">
            <uni-row>
                <uni-col :span="3">
                    <image src="../../static/dengji.png" class="photo"></image>
                </uni-col>
                <uni-col :span="21">
                    <view class="zik"></view>
                    <text class="zi">2024年春节放假</text>
                </uni-col>
            </uni-row>
            <view style="margin-left:20px ">
                <text class="zi2">
                    假期开始时间：2023-11-16 00:00:00 \n
                    假期结束时间：2023-11-16 00:00:00 \n
                    时长：26天</text>
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <hr class="xian">
            </view>

            <view style="margin-top: 10px;margin-left: 20px">
                <uni-row>
                    <uni-col :span="2">
                        <view class="avatrial"><text class="avatrialname">张</text> </view>
                    </uni-col>
                    <uni-col :span="17">
                        <text class="passmsg">审批不通过</text>
                    </uni-col>
                    <uni-col :span="5">
                        <view class="trialbu"> <text class="trialbumsg"> 修改登记</text></view>
                    </uni-col>
                </uni-row>
            </view>
        </view>
        <view class="card1" style="margin-top: 20px" @click="tonopass()">
            <uni-row>
                <uni-col :span="3">
                    <image src="../../static/dengji.png" class="photo"></image>
                </uni-col>
                <uni-col :span="21">
                    <view class="zik"></view>
                    <text class="zi">2024年春节放假</text>
                </uni-col>
            </uni-row>
            <view style="margin-left:20px ">
                <text class="zi2">
                    假期开始时间：2023-11-16 00:00:00 \n
                    假期结束时间：2023-11-16 00:00:00 \n
                    时长：26天</text>
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <hr class="xian">
            </view>

            <view style="margin-top: 10px;margin-left: 20px">
                <uni-row>
                    <uni-col :span="2">
                        <view class="avatrial"><text class="avatrialname">张</text> </view>
                    </uni-col>
                    <uni-col :span="17">
                        <text class="passmsg">审批不通过</text>
                    </uni-col>
                    <uni-col :span="5">
                        <view class="trialbu"> <text class="trialbumsg"> 修改登记</text></view>
                    </uni-col>
                </uni-row>
            </view>
        </view>
        <view class="card1" style="margin-top: 20px" @click="tonopass()">
            <uni-row>
                <uni-col :span="3">
                    <image src="../../static/dengji.png" class="photo"></image>
                </uni-col>
                <uni-col :span="21">
                    <view class="zik"></view>
                    <text class="zi">2024年春节放假</text>
                </uni-col>
            </uni-row>
            <view style="margin-left:20px ">
                <text class="zi2">
                    假期开始时间：2023-11-16 00:00:00 \n
                    假期结束时间：2023-11-16 00:00:00 \n
                    时长：26天</text>
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <hr class="xian">
            </view>

            <view style="margin-top: 10px;margin-left: 20px">
                <uni-row>
                    <uni-col :span="2">
                        <view class="avatrial"><text class="avatrialname">张</text> </view>
                    </uni-col>
                    <uni-col :span="17">
                        <text class="passmsg">审批不通过</text>
                    </uni-col>
                    <uni-col :span="5">
                        <view class="trialbu"> <text class="trialbumsg"> 修改登记</text></view>
                    </uni-col>
                </uni-row>
            </view>
        </view>
    </view>
    <view v-else-if="delay==undefined">
        <uni-notice-bar  style="text-align: center;" text="1个批次需要登记" single color="#FF5F00" background-color="#FFEEDD" />
        <view class="card1" @click="topass()">
            <uni-row>
                <uni-col :span="3">
                    <image src="../../static/dengji.png" class="photo"></image>
                </uni-col>
                <uni-col :span="21">
                    <view class="zik"></view>
                    <text class="zi">2024年春节放假</text>
                </uni-col>
            </uni-row>
            <view style="margin-left:20px ">
                <text class="zi2">
                    假期开始时间：2023-11-16 00:00:00 \n
                    假期结束时间：2023-11-16 00:00:00 \n
                    时长：26天</text>
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <hr class="xian">
            </view>

            <view style="margin-top: 10px;margin-left: 20px">
                <uni-row>
                    <uni-col :span="2">
                        <view class="avatrial"><text class="avatrialname">张</text> </view>
                    </uni-col>
                    <uni-col :span="17">
                        <text class="okmsg">审批通过</text>
                    </uni-col>
                    <uni-col :span="5">
                        <view class="trialbu"> <text class="trialbumsg">离校申请</text></view>
                    </uni-col>
                </uni-row>
            </view>
        </view>
    </view>
    <view v-else-if="end==undefined">
        <uni-notice-bar  style="text-align: center;" text="1个批次需要登记" single color="#FF5F00" background-color="#FFEEDD" />
        <view class="card1" @click="todelay()">
            <uni-row>
                <uni-col :span="3">
                    <image src="../../static/dengji.png" class="photo"></image>
                </uni-col>
                <uni-col :span="21">
                    <view class="zik"></view>
                    <text class="zi">2024年春节放假</text>
                </uni-col>
            </uni-row>
            <view style="margin-left:20px ">
                <text class="zi2">
                    假期开始时间：2023-11-16 00:00:00 \n
                    假期结束时间：2023-11-16 00:00:00 \n
                    时长：26天</text>
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <hr class="xian">
            </view>

            <view style="margin-top: 10px;margin-left: 20px">
                <uni-row>
                    <uni-col :span="2">
                        <view class="avatrial"><text class="avatrialname">张</text> </view>
                    </uni-col>
                    <uni-col :span="17">
                        <text class="okmsg">审批通过</text>
                    </uni-col>
                    <uni-col :span="5">
                        <view class="trialbu"> <text class="trialbumsg">延长离校</text></view>
                    </uni-col>
                </uni-row>
            </view>
        </view>
    </view>
    <view v-else>
        <uni-notice-bar  style="text-align: center;" text="1个批次需要登记" single color="#FF5F00" background-color="#FFEEDD" />
        <view class="card1" >
            <uni-row>
                <uni-col :span="3">
                    <image src="../../static/dengji.png" class="photo"></image>
                </uni-col>
                <uni-col :span="21">
                    <view class="zik"></view>
                    <text class="zi">2024年春节放假</text>
                </uni-col>
            </uni-row>
            <view style="margin-left:20px ">
                <text class="zi2">
                    假期开始时间：2023-11-16 00:00:00 \n
                    假期结束时间：2023-11-16 00:00:00 \n
                    时长：26天</text>
            </view>
            <view style="margin-top: 10px;margin-left: 20px">
                <hr class="xian">
            </view>

            <view style="margin-top: 10px;margin-left: 20px">
                <uni-row>
                    <uni-col :span="2">
                        <view class="avatrial"><text class="avatrialname">张</text> </view>
                    </uni-col>
                    <uni-col :span="17">
                        <text class="okmsg">审批通过</text>
                    </uni-col>
                    <uni-col :span="5">
                        <view class="trialbu"> <text class="trialbumsg">留校申请</text></view>
                    </uni-col>
                </uni-row>
            </view>
        </view>
    </view>

</template>

<script setup>

import { ref } from 'vue';
import data from '../../data/data.json'
import UniRow from "../../uni_modules/uni-row/components/uni-row/uni-row.vue";
import UniCol from "../../uni_modules/uni-row/components/uni-col/uni-col.vue";
import UploadImage from "../../uni_modules/uni-file-picker/components/uni-file-picker/upload-image.vue";
import UniLink from "../../uni_modules/uni-link/components/uni-link/uni-link.vue";

let  stay =  ref(null)
let toapply=function(){
    uni.navigateTo({
        url:'/pages/index/applyliuxiao'
    })
}
let tocancle=function (){
    uni.navigateTo({
        url:'/pages/index/cancle'
    })
}
let topass=function (){
    uni.navigateTo({
        url:'/pages/index/pass'
    })
}
let tonopass=function (){
    uni.navigateTo({
        url:'/pages/index/nopass'
    })
}
let todelay=function(){
    uni.navigateTo({
        url:'/pages/index/delay'
    })
}
stay.value=data.stay
console.info(stay.value)
let cancel=ref(null)
cancel.value=data.cancel
let pass=ref(null)
pass.value=data.pass
let ok=ref(null)
ok.value=data.ok
let delay=ref(null)
delay.value=data.delay
let end=ref(null)
end.value=data.end
</script>

<style scoped>
  .img{
margin-top: 91px;
    text-align: center;

  }
  .msg{

    font-family: PingFangSC-Regular;
    font-weight: 400;
    font-size: 15px;
    text-align: center;
    color: #707070;
    margin-top: 23px;
  }
  .trialmsg{
      width: 36px;
      height: 17px;
      font-family: PingFangSC-Regular;
      font-weight: 400;
      font-size: 12px;
      color: #166AFF;
      text-align: center;
  }
  .avatrial{
      width: 24px;
      height: 24px;
      background: #FFE9BF;
      border-radius: 50%;
      text-align: center;
  }
  .trialbu{
      width: 64px;
      height: 26px;
      background-image: linear-gradient(90deg, #6CA9FF 0%, #166AFF 100%);
      border-radius: 4px;
      text-align: center;
  }
  .trialbumsg{
      font-family: PingFangSC-Regular;
      font-weight: 400;
      font-size: 12px;
      color: #FFFFFF;

      line-height: 24px;
  }
  .avatrialname{
      width: 12px;
      height: 17px;
      font-family: PingFangSC-Regular;
      font-weight: 400;
      font-size: 12px;
      color: #FFA93F;
      text-align: center;
  }
  .card1{
      width: 92%;
      height: 160px;
      background-image: linear-gradient(180deg, #E9F1FF 0%, #FFFFFF 100%);
      box-shadow: 0 2px 5px 0 #E2E4EB;
      border-radius: 10px;
      background-image: url("../../static/bg.png");
      background-size: 450px;
      margin-left: 20px;
  }
  .zi{
      width: 119px;
      height: 22px;
      font-family: PingFangSC-Medium;
      font-weight: 500;
      font-size: 16px;
      color: #212121;
  }
  .photo{
      width: 22px;
      height: 22px;
      margin-left: 20px;
      margin-top: 14px;
  }
  .zik{
      margin-left:10px;
      margin-top: 14px;
  }
  .zi2{
      width: 203px;
      height: 66px;
      font-family: PingFangSC-Regular;
      font-weight: 400;
      font-size: 12px;
      color: #5D5E5D;
      line-height: 22px;

  }
  .zi3{
      width: 135px;
      height: 17px;
      font-family: PingFangSC-Regular;
      font-weight: 400;
      font-size: 12px;
      color: #999DA3;
      text-align: center;

  }
  .passmsg{
      width: 60px;
      height: 17px;
      font-family: PingFangSC-Regular;
      font-weight: 400;
      font-size: 12px;
      color: #CB000E;
  }
  .xian{
      width: 90%;
      height: 1px;
      background-color: #F1F3F9;
      border:none
  }
  .okmsg{
      width: 48px;
      height: 17px;
      font-family: PingFangSC-Regular;
      font-weight: 400;
      font-size: 12px;
      color: #00A035;
  }
</style>
